<!DOCTYPE html>
<html>
    <head>
    <title>Submit a form via AJAX</title>
      <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" />
      <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
      <script src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>
</head>
<body>
    <script>
        function onSuccess(data, status)
        {
            data = $.html(data);
            $("#notification").text(data);
        }
  
        
            function onerror(data,statuts)
		{alert("error");
		}
        
		$.mobile.hidePageloadingMsg();
		
		
		$.mobile.changePage( "M_test.php", {
	    type: "post",
	    data: $("#callAjaxForm"").serialize()
});

		
  
     //   $(document).ready(function() {
            $("#submit").click(function(){
  
                var formData = $("#callAjaxForm").serialize();
  
                $.ajax({
                    type: "POST",
                    url: "callajax.php",
                    cache: false,
                    data: formData,
                    success: onSuccess,
                    error: onError
                });
  
                return false;
            }); //
        });
    </script>
  
    <!-- call ajax page -->
    <div data-role="page" id="callAjaxPage">
        <div data-role="header">
            <h1>Call Ajax</h1>
        </div>
  
        <div data-role="content">
            <form id="callAjaxForm">
                <div data-role="fieldcontain">
                    <label for="firstName">First Name</label>
                    <input type="text" name="firstName" id="firstName" value=""  />
 
                    <label for="lastName">Last Name</label>
                    <input type="text" name="lastName" id="lastName" value=""  />
                    <h3 id="notification"></h3>
                    <button data-theme="b" id="submit" type="submit">Submit</button>
                </div>
            </form>
        </div>
  
        <div data-role="footer">
            <h1>GiantFlyingSaucer</h1>
        </div>
    </div>
</body>
</html>